<script lang="ts" setup name="ndeReportOriginalRecord">
import {
  changeNdeCommissionStatus,
  getListByConditionsWithPage,
  isLoginUserById,
  urls
} from '@/index';
import NdeCommissionDetailDialog from './NdeCommissionDetailDialog.vue';
import type {
  DialogModel,
  NdeCommissionNdeCommission,
  NdeCommissionNdeCommissionQueryCondition,
  NdeMethod,
  NdeRecord,
  NdeRecordDialogModel,
  TableOperateType
} from '@/index.d';
import { useRequest } from 'vue-request';

const PtRecordDialog = defineAsyncComponent(() => import('./pt/index.vue'));
const MtRecordDialog = defineAsyncComponent(() => import('./mt/index.vue'));
const RtRecordDialog = defineAsyncComponent(() => import('./rt/index.vue'));
const UtRecordDialog = defineAsyncComponent(() => import('./ut/index.vue'));
const ChRecordDialog = defineAsyncComponent(() => import('./ch/index.vue'));

let DialogComponent = PtRecordDialog;

const title = ref<string>('无损检测记录');

const queryCondition = reactive<NdeCommissionNdeCommissionQueryCondition>({
  deleted: false,
  change: false,
  currentPage: 1,
  pageSize: 20,
  commissionStatus: '执行委托'
});

const resetQueryCondition = () => {
  queryCondition.currentPage = 1;
  queryCondition.pageSize = 20;
  queryCondition.deleted = false;
  delete queryCondition.productionReference;
  delete queryCondition.method;
};

const {
  data: getMainTableListData,
  run: getMainTableListRun,
  loading: getMainTableListLoading
} = useRequest(() =>
  getListByConditionsWithPage<NdeCommissionNdeCommission>(
    urls.ndeCommissionNdeCommission,
    queryCondition
  )
);

const handleResetQuery = () => {
  resetQueryCondition();
  getMainTableListRun();
};

const ndeRecordDialogModel = reactive<NdeRecordDialogModel<NdeRecord>>({
  visible: false,
  title: title.value as string,
  type: 'view',
  id: 0,
  change: false,
  ndeCommissionId: 0
});

watch(
  () => ndeRecordDialogModel.visible,
  (value: boolean) => {
    if (!value && ndeRecordDialogModel.change) {
      getMainTableListRun();
      ndeRecordDialogModel.change = false;
    }
  }
);

const detailDialogModel = reactive<DialogModel<NdeRecord>>({
  visible: false,
  title: title.value as string,
  type: 'view',
  id: 0,
  change: false
});

const openNdeRecordDialog = (
  ndeMethodArg: NdeMethod,
  ndeRecordId: number,
  ndeCommissionId: number,
  operateType: TableOperateType
) => {
  ndeRecordDialogModel.title = ndeMethodArg;
  ndeRecordDialogModel.id = ndeRecordId;
  ndeRecordDialogModel.ndeCommissionId = ndeCommissionId;
  ndeRecordDialogModel.visible = true;
  ndeRecordDialogModel.type = operateType;
  DialogComponent = ndeMethodArg === 'PT' ? PtRecordDialog : MtRecordDialog;
  switch (ndeMethodArg) {
    case 'PT':
      DialogComponent = PtRecordDialog;
      break;
    case 'MT':
      DialogComponent = MtRecordDialog;
      break;
    case 'RT':
      DialogComponent = RtRecordDialog;
      break;
    case 'UT':
      DialogComponent = UtRecordDialog;
      break;
    case 'CH':
      DialogComponent = ChRecordDialog;
  }
};
</script>
<template>
  <HqContainerTable
    :base-url="urls.ndeCommissionNdeCommission"
    :title="title"
    :loading="getMainTableListLoading"
    :total="getMainTableListData?.total"
    :table-data="getMainTableListData?.records"
    v-model:pageSize="queryCondition.pageSize"
    v-model:current-page="queryCondition.currentPage"
    @handle-query="getMainTableListRun"
    @handle-reset-query="handleResetQuery"
    @handle-reload="getMainTableListRun"
    v-model:detail-dialog-model="detailDialogModel"
    :operate-column="true"
  >
    <template #search>
      <hq-col kind="search">
        <el-select
          v-model="queryCondition.productionReference"
          placeholder="请选择生产令号"
          clearable
          filterable
          @change="getMainTableListRun"
        >
          <HqProjectProductionReference />
        </el-select>
      </hq-col>
      <hq-col kind="search">
        <el-select
          v-model="queryCondition.method"
          clearable
          placeholder="请选择方法"
          @change="getMainTableListRun"
        >
          <HqNdeMethodOptions />
        </el-select>
      </hq-col>
    </template>

    <template #button> </template>

    <template #tableColumns>
      <HqTableColumn label="原始记录" :min-width="80">
        <template #default="{ row }">
          <el-button-group>
            <el-button
              link
              type="success"
              @click="changeNdeCommissionStatus(row.id, '审核报告', getMainTableListRun)"
              v-if="row.recordId"
            >
              提交
            </el-button>
            <el-button
              link
              type="primary"
              @click="openNdeRecordDialog(row.method, row.recordId, row.id, 'view')"
              v-if="row.recordId"
            >
              查看
            </el-button>
            <el-button
              link
              type="success"
              @click="openNdeRecordDialog(row.method, 0, row.id, 'insert')"
              v-if="!row.recordId && isLoginUserById(row.ownerId)"
            >
              新增
            </el-button>
            <el-button
              link
              type="warning"
              @click="openNdeRecordDialog(row.method, row.recordId, row.id, 'update')"
              v-if="row.recordId && isLoginUserById(row.ownerId)"
            >
              修改
            </el-button>

            <el-button
              link
              type="danger"
              @click="openNdeRecordDialog(row.method, row.recordId, row.id, 'update')"
              v-if="row.recordId && isLoginUserById(row.ownerId)"
            >
              删除
            </el-button>
          </el-button-group>
        </template>
      </HqTableColumn>
      <HqTableColumn label="责任人" prop="owner.name" :min-width="80" />
      <HqTableColumn label="检测方法" prop="method" :min-width="80" />
      <HqTableColumn label="委托状态" prop="commissionStatus" :min-width="80" />
      <HqTableColumn label="生产令号" prop="productionReference" :min-width="80" />
      <HqTableColumn label="工件名称" prop="partName" :min-width="100" />
      <HqTableColumn label="工件编号" prop="partReference" :min-width="100" />
      <HqTableColumn label="数量" prop="partQuantity" :min-width="100" />
      <HqTableColumn label="检测时机" prop="testStage" :min-width="100" />
    </template>
  </HqContainerTable>
  <component
    :is="DialogComponent"
    v-model:dialog-model="ndeRecordDialogModel"
    v-if="ndeRecordDialogModel.visible"
  />

  <NdeCommissionDetailDialog
    v-model:dialog-model="detailDialogModel"
    v-if="detailDialogModel.visible"
  />
</template>
<style lang="scss" scoped></style>
